import 'package:enterprise_v6_app/app/components/custom_app_bar.dart';
import 'package:enterprise_v6_app/app/components/custom_refresh.dart';
import 'package:enterprise_v6_app/app/components/special_operation/custom_title_chart_page.dart';
import 'package:enterprise_v6_app/app/core/ext/widget_extension.dart';
import 'package:enterprise_v6_app/app/core/values/colors.dart';
import 'package:enterprise_v6_app/app/core/values/gaps.dart';
import 'package:enterprise_v6_app/app/core/values/images.dart';
import 'package:enterprise_v6_app/app/modules/application/double_prevention_page/risk_control_page/task_implementation_page/task_practicable/task_practicable_controller.dart';
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:flutter_svg/svg.dart';
import 'package:get/get.dart';

///任务落实 详情 台账
class TaskPracticablePage extends StatelessWidget {
  TaskPracticablePage({super.key});

  final controller = Get.put(TaskPracticableController());

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: AppColors.bg_color_grey,
      appBar: CustomAppBar(
        titleText: '风险管控清单',
      ),
      body: Container(
        color: AppColors.bg_color_grey,
        padding: EdgeInsets.only(top: 12.w, right: 14.w, left: 14.w),
        child: Column(
          children: [
            Row(
              children: [
                Expanded(
                  child: _getSearchEnterWidget(),
                ),
                AppGaps.hGap8,
                _screen(),
                AppGaps.vGap10,
              ],
            ),
            AppGaps.vGap12,
            Expanded(
                child: CustomEasyRefreshList<String>(
              dataLoad: controller.getInstrumentData,
              itemBuilder: (item, index) {
                return CustomTitleChartPage(
                  titleView: Container(
                    padding: EdgeInsets.symmetric(horizontal: 17.w, vertical: 12.w),
                    child: Row(
                      children: [
                        SvgPicture.asset(
                          AppImages.icon_not_implemented_bg,
                          width: 50.w,
                          height: 20.w,
                        ),
                        AppGaps.hGap10,
                        Expanded(
                            child: Text(
                          '检查压力表是否...',
                          style: TextStyle(
                              color: const Color(0xFF333333),
                              height: 1.2,
                              fontWeight: FontWeight.w500,
                              fontSize: 15.sp),
                        )),
                        Row(
                          children: [
                            Text(
                              '台账',
                              style: TextStyle(
                                fontSize: 12.sp,
                                fontWeight: FontWeight.w400,
                                color: const Color(0xff5C6DFF),
                              ),
                            ),
                            Container(
                              margin: EdgeInsets.only(left: 4.w),
                              child: SvgPicture.asset(
                                AppImages.icon_new_see_details_right,
                                width: 14.w,
                                height: 14.w,
                              ),
                            ),
                          ],
                        ).click(controller.onLedgerDetailButtonPressed)
                      ],
                    ),
                  ),
                  child: Column(
                    crossAxisAlignment: CrossAxisAlignment.start,
                    children: [
                      _rowData('排查类型：', '日常排查'),
                      AppGaps.vGap12,
                      _rowData('巡检周期：', '1/h'),
                      AppGaps.vGap12,
                      _rowData('工作时段：', '00:00-24:00'),
                      AppGaps.vGap12,
                      Container(
                        padding: EdgeInsets.symmetric(vertical: 10.w),
                        decoration: BoxDecoration(
                          borderRadius: BorderRadius.circular(8),
                          color: const Color(0x1A5C6DFF),
                        ),
                        child: Row(
                          mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                          children: [
                            _topTitle('正常', const Color(0xFF5C6DFF), '6', const Color(0xFF5C6DFF)),
                            _divider(),
                            _topTitle('逾期补检', const Color(0xFF5C6DFF), '5', const Color(0xFFFC9900)),
                            _divider(),
                            _topTitle('漏检', const Color(0xFF5C6DFF), '0', const Color(0xFFFD6B6B)),
                          ],
                        ),
                      ),
                    ],
                  ),
                );
              },
            )),
          ],
        ),
      ),
    );
  }

  Widget _topTitle(String title, Color color, String? value, Color square) {
    return Row(
      crossAxisAlignment: CrossAxisAlignment.center,
      mainAxisAlignment: MainAxisAlignment.start,
      children: [
        Text(
          title,
          style: TextStyle(
            fontSize: 12.sp,
            color: color,
            height: 1.2,
            fontWeight: FontWeight.w400,
          ),
        ),
        AppGaps.hGap12,
        Text(
          value ?? '空',
          style: TextStyle(
            fontSize: 16.sp,
            color: square,
            fontWeight: FontWeight.w500,
          ),
        ),
      ],
    );
  }

  ///搜索框
  Widget _getSearchEnterWidget() {
    return Container(
        height: 38.w,
        padding: EdgeInsets.symmetric(horizontal: 12.w),
        alignment: Alignment.center,
        decoration: BoxDecoration(
            color: Colors.white,
            border: Border.all(color: const Color(0xffF0F0F0), width: 1.w),
            borderRadius: BorderRadius.all(Radius.circular(8.w))),
        child: Row(
          children: [
            SvgPicture.asset(
              AppImages.icon_search,
              width: 16.w,
            ),
            Expanded(
                child: TextField(
                    keyboardType: TextInputType.text,
                    textInputAction: TextInputAction.done,
                    onChanged: (value) {
                      // controller.search = value;
                      // controller.refreshPage();
                    },
                    style: TextStyle(
                        color: const Color(0xff222222), fontWeight: FontWeight.w400, fontSize: 14.sp),
                    decoration: InputDecoration(
                      counterText: '',
                      //防止适配不居中
                      isCollapsed: true,
                      border: const OutlineInputBorder(borderSide: BorderSide.none),
                      contentPadding: EdgeInsets.only(left: 8.w),
                      hintText: '搜索任务名称',
                      hintStyle: TextStyle(
                          fontSize: 14.sp, fontWeight: FontWeight.w400, color: const Color(0xffA0A7B5)),
                    )))
          ],
        ));
  }

  ///筛选
  Widget _screen() {
    return Container(
      width: 38.w,
      height: 38.w,
      alignment: Alignment.center,
      decoration: BoxDecoration(color: Colors.white, borderRadius: BorderRadius.circular(8.w)),
      child: SvgPicture.asset(
        AppImages.icon_search_screen,
        width: 16.w,
      ),
    ).click(controller.onFilterButtonPressed);
  }

  Widget _rowData(String name, String value,
      {MainAxisAlignment mainAxisAlignment = MainAxisAlignment.spaceBetween}) {
    return Row(
      mainAxisAlignment: mainAxisAlignment,
      children: [
        Text(
          name,
          style: TextStyle(
            color: const Color(0xFFA5A6B5),
            fontWeight: FontWeight.w400,
            fontSize: 13.sp,
          ),
        ),
        Text(
          value,
          style: TextStyle(
            color: const Color(0xFF495061),
            fontSize: 12.sp,
            fontWeight: FontWeight.w400,
          ),
        )
      ],
    );
  }

  ///分割线
  Widget _divider() {
    return Container(
      width: 1.w,
      height: 12.w,
      decoration: const BoxDecoration(
          gradient: LinearGradient(begin: Alignment.topCenter, end: Alignment.bottomCenter, colors: [
        Color(0xFFA0A7B5),
        Color(0xFFA0A7B5),
      ])),
    );
  }
}
